HubEmbedOptions

The HubEmbedOptions object contains details on the embedding of the hub, including which embed hub template should be embedded, instance properties and custom style settings.

Constructors

hubEmbedOptions{ theme:string, editable: boolean, responsiveness: string, showTabs :boolean, style?: styles, smartReportDialogPopupMode: string, template?: string}: hubEmbedOptions
  • Use this to set the details for embedding for a hub.
  • Theme is a string to drive the main UI color scheme - which can be fully customized with styles (below). Required. Colors are:
    • "dark"
    • "light" (default)
  • Editable is a boolean flag that indicates whether the user has editing capabilities on the instance. Required.
  • Responsiveness is a choice that drives the way the hub behaves as the hosting page's size changes. Required.
    • "compact"
    • "none"
  • The Showtabs is a boolean to hide or show the hub 's tabs in the UI
  • The style property accepts a collection of style settings to customize the hub's UI.
  • The smartReportDialogPopupMode is a flag to hide or show the "Smart Discover" report builder.
    • "none"
    • "tab" - the builder pops up as a new browser tab
    • "phone" - the builder pops up as a lightbox on the hosting page
  • The template is the name of the embed template to use. The name is found in the admin for the designated Hub template package for the user's tenant.

Example

The following instantiates a new hub with the following hub embed options: dark theme, editable, show the tabs with compact responsiveness, Notice that is does not have any custom styling, and the template is going to be the default one defined in the Pyramid admin.

const hubEmbedOptions = { theme: "dark", editable: true, showTabs: true, responsiveness: "compact", }; const hub = await embedClient.hub(container, hubEmbedOptions);